import { memo } from 'react'
import Taro from '@tarojs/taro'
import { View, Image, Text } from '@tarojs/components'

import './index.scss'

function GoodsItem ({ imageUrl, code }) {

  const handleClick = () => {
    Taro.navigateTo({
      url: `/pages/goods-detail/index?code=${code}`
    })
  }

  return (
    <View className='goods-item' onClick={handleClick}>
      <View className='goods-item__left'>
        <Image
          mode='aspectFill'
          className='goods-item__left__img'
          src={imageUrl}
        />
      </View>
      <View className='goods-item__right'>
        <Text className='goods-item__right__title'>{code}</Text>
      </View>
    </View>
  )
}

export default memo(GoodsItem)
